<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<script>
/*
	...的用法
*/
	// 用...赋值
	var arr1 = [11,22]
	var arr2 = arr1; // 指向同一个指针，当arr1的值改变，arr2也会变，，arr2和arr1始终一样
	var arr3 = [...arr1]; // 指向不同的指针，当arr1的值改变，arr3不会变
	arr1.push(333) // 改变arr1的值
	console.log('用...赋值', arr2, arr3)

	// 用...合并 === concat
	var arr1 = [11, 22];
	var arr2 = [33, 44];
	var arr = [...arr1, ...arr2]
	console.log('用...合并 === concat', arr)

/*
	reduce的用法
	reduceRight表示从末尾开始累加
*/
	// reduce数组之和
		var arr1 = [1,1,2,3,4,5,6];
		Array.prototype.reduceSum = function() {
			return this.reduce(function (preValue, curValue){
				return preValue + curValue
			}, 0) // 0(initialValue)表示preValue的第一个值，如果没给initialValue值。则preValue的第一个值是1，curValue的第一个值则为2
		}
		console.log('reduce数组之和',arr1.reduceSum());
	// reduce数组对象属性之和
		var arr2 = [{
			name: 1,
			age: 11
		}, {
			name: 2,
			age: 22
		}, {
			name: 2,
			age: 22
		}, {
			name: 4,
			age: 44
		}, {
			name: 4,
			age: 44
		}];
		Array.prototype.reduceSum2 = function() {
			return this.reduce(function (preValue, curValue){
				// console.log('preValue', this)
				return preValue + curValue.age
			}, 0)
		}
		console.log('reduce数组对象属性之和',arr2.reduceSum2());
	// reduce数组对象属性去重
		var hash = {};
		var newArr = arr2.reduce((preValue, curValue) => {
				// console.log('789797', preValue, curValue,hash[curValue.name])
		    hash[curValue.name] ? '' : hash[curValue.name] = (true && preValue.push(curValue));
		    return preValue
		}, []);
		// let array = Array.from(new Set(arr1)); // 数组去重
		console.log('reduce数组对象属性去重', newArr)
		// 
		var newArr = arr2.reduce((preValue,curValue) => preValue.age < curValue.age ? curValue : preValue)
	// reduce取数组对象某个属性的值
		console.log('reduce取数组对象某个属性的值', newArr)
	// reduce查找字符串某个字母出现的个数
		var arrString = 'abcdaabc';
		var objString = arrString.split('');
		var str = objString.reduce(function(pre, cur) {
			// console.log(pre, cur)
		    pre[cur] ? pre[cur] ++ : pre[cur] = 1
		    return pre;
		}, {})
 		console.log('reduce查找字符串某个字母出现的个数', str)

/*
	map的用法
*/ 	
	// map返回数组对象某个属性的值
		var arr = [{
			id: 1,
			name: '小米',
			checked: true,
			arr2: [{
				name: '波仔',
				ids: '123123'
			}]
		}, {
			id: 2,
			name: '小明',
			checked: false,
			arr2: [{
				name: '波仔',
				ids: '123123'
			}]
		}, {
			id: 3,
			name: '小波',
			checked: true,
			arr2: [{
				name: '波仔',
				ids: '123123'
			}]
		}, {
			id: 4,
			name: '小兰',
			checked: true,
			arr2: [{
				name: '波仔',
				ids: '123123'
			}]
		}]
		var ids = arr.map((item,index,arr) => {
			return {
				id: item.id,
				arr2: item.arr2.map(item2 => {return {name: item2.name}})
			}
		})
		console.log('map返回数组对象某个属性的值', ids)

	// map遍历
		var arr = [{
			name: 1,
			text: 'aaa'
		},{
			name: 2,
			text: 'bbbb'
		}, 3]
		var newArr = [];
		arr.map(item => {
			newArr.push({...item}) // {...item}表示item必须是个对象，如果把...去掉，就成为了item: {}
		})
		console.log('map遍历', newArr)

/*
	filter的用法
*/
	// filter结合map的用法 
		var arr = [{
			id: 1,
			num: 1,
			text: '你',
			checked: true
		}, {
			id: 2,
			num: 3,
			text: '好',
			checked: false
		}, {
			id: 3,
			num: 4,
			text: '啊',
			checked: false
		}, {
			id: 4,
			num: 2,
			text: '！',
			checked: true
		}]
		var newArr = arr.filter(item => item.checked ).map(item => item.id)
		console.log('filter结合map的用法', newArr)
/*
	对象合并的两种方法
*/ 
		var obj1 = {
			id: 1,
			name: '你好'
		}
		var obj2 = {
			name: '波波'
		}
		var obj3 = {...obj1, ...obj2};
		var obj4 = Object.assign(obj1, obj2)

		console.log('对象合并的两种方法', obj3, obj4)

/*
	类的继承和注入
*/
	// __proto__ 注入
		class Foo {
		  constructor(){
		    this.pingMsg ='pong'
		  }
		  ping(){
		   console.log(this.pingMsg)
		  }
		}
		console.log(Foo.pingMsg)
		let o ={
		 __proto__:new Foo(),
		  constructor(){
		    this.pingMsg ='alive'
		  },
		  msg:'bang',
		  yell(){
		   console.log(this.msg)
		  }
		}
		o.yell()//=> bang
		o.ping()//=> alive

		function search(param1, param2){
		  return{
		   users: param1,
		   posts: param2
		  }
		}
		let{ users, posts } = search(11111, 33333)
		console.log(users, posts)



	</script>
</body>
</html>

